<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib uri="/WEB-INF/quik_function.tld" prefix="qu"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>咨客_开房间</title>
		<link href="<c:url value="/resources/css/style.css" />" rel="stylesheet" type="text/css">
		<link href="<c:url value="/resources/css/default/easyui.css" />" rel="stylesheet" type="text/css">
		<link href="<c:url value="/resources/css/icon.css" />" rel="stylesheet" type="text/css">
		<script type="text/javascript" src="<c:url value="/resources/js/jquery-1.7.2.js" />"></script>
		<script type="text/javascript" src="<c:url value="/resources/js/util.js" />"></script>
		<script type="text/javascript">
			function onReturn(){
				location.href = "${pageContext.request.contextPath}/consultRoom/roomList";
			}
			
			function onOpenRoom(){
				if($.trim($("#token_no").val()) == ''){
					$.messager.alert('警告','请填写手牌!');
					return false;
				}
				
				var qty = $("#qty").val() == 'undefined' ? "":$("#qty").val();
				var service = $("#worker1").val() == 'undefined' ? "":$("#worker1").val();
				var chess = $("#chess").val() == 'undefined' ? "":$("#chess1").val();
				
				$.ajax({
					url:'openRoom',
					data:{'tokenNo':$.trim($("#token_no").val()), 'roomNo':'${room.room_no}',
						  'qty':qty, 'service':service, 'chess':chess, 'productNo':'${product.product_no}'},
					type:'post',
					dataType:'text',
					async:false,
					cache:false,
					success:function(data){
						$('#tokenDiv').dialog('close');
						if(data == "success"){
							$.messager.alert('操作结果','开房成功!');
							alterBtn();
						}else{
							$.messager.alert('操作结果',data);
						}
					}
				});
			}
			
			function onOpenRoomNoToken(){
				var qty = $("#qty").val() == 'undefined' ? "":$("#qty").val();
				var service = $("#worker1").val() == 'undefined' ? "":$("#worker1").val();
				var chess = $("#chess").val() == 'undefined' ? "":$("#chess1").val();
				
				$.ajax({
					url:'openRoomNoToken',
					data:{'contactStaffNo':$.trim($("#contactStaffNo").val()),
						  'qty':qty, 'service':service, 'chess':chess,
						  'roomNo':'${room.room_no}',
						  'productNo':'${product.product_no}'},
					type:'post',
					dataType:'text',
					async:false,
					cache:false,
					success:function(data){
						$('#contactDiv').dialog('close');
						if(data == "success"){
							$.messager.alert('操作结果','开房成功!');							
							alterBtn();
						}else{
							$.messager.alert('操作结果',data);
						}
					}
				});
			}
			
			function alterBtn(){
				$("#statusTd").html('使用'); //房间状态

				if($("#openTable tr:eq(1) td").html() != '未绑定项目'){								
					$("#qtySPAN").html($("#qty").val());
				}
				
				$("#openRoomBtn").attr("disabled", true);
				$("#openRoomByTokenBtn").attr("disabled", true);
			}
			
			function totalPrice(num, price, id){				
				var total = num * price;
				$("#" + id).html(numFormat(total));
			}
			
			function init(){
				$('#tokenDiv').dialog('close');
				$('#contactDiv').dialog('close');
			}
		</script>
	</head>
	
	<body onload="init()">
		<c:import url="/WEB-INF/resources/common/consult_header.jsp" />
		
		<div>
			<div style="float: left;margin-right: 10px;width:750px;height: 600px;">
				<h1>房间信息</h1>
				<table style="border-collapse: collapse;width:600px;text-align: center;">
					<tr>
						<td style="border: 1px solid #7F9DB9;font-weight: bold;">房间号</td>
						<td style="border: 1px solid #7F9DB9;">${room.room_no}</td>
						<td style="border: 1px solid #7F9DB9;font-weight: bold;">房间类型</td>
						<td style="border: 1px solid #7F9DB9;">${room.roomTypeName }</td>
					</tr>
					
					<tr>
						<td style="border: 1px solid #7F9DB9;font-weight: bold;">房间人数</td>
						<td style="border: 1px solid #7F9DB9;">${room.capacity}</td>
						<td style="border: 1px solid #7F9DB9;font-weight: bold;">房间区域</td>
						<td style="border: 1px solid #7F9DB9;">${room.roomAreaName}</td>
					</tr>
					
					<tr>
						<td style="border: 1px solid #7F9DB9;font-weight: bold;">房间电话</td>
						<td style="border: 1px solid #7F9DB9;">${room.tel_no}</td>
						<td style="border: 1px solid #7F9DB9;font-weight: bold;">房间状态</td>
						<td style="border: 1px solid #7F9DB9;" id="statusTd">${room.statusName}</td>
					</tr>
				</table>
			
			
				<h1 style="margin-top: 30px;">绑定项目</h1>
			
				<div style="margin-top: 10px;">
					<table id="openTable" style="border-collapse: collapse;width:700px;text-align: center;">
						<tr>
							<td style="width:10%; border: 1px solid #7F9DB9;">编号</td>
							<td style="width:12%; border: 1px solid #7F9DB9;">绑定项目</td>
							<td style="width:5%; border:1px solid #7F9DB9">数量</td>
							<td style="width:15%; border: 1px solid #7F9DB9;">单价</td>
							<td style="width:15%; border: 1px solid #7F9DB9;">总价</td>
							<td style="width:8%; border: 1px solid #7F9DB9;">是否打折</td>
							<td style="width:8%; border: 1px solid #7F9DB9;">是否技师</td>							
						</tr>
					
						<c:choose>
						<c:when test="${product != null}">
						<tr>
							<td style="width:10%; border: 1px solid #7F9DB9;">${product.product_no}</td>
							<td style="width:12%; border: 1px solid #7F9DB9;">${product.product_name}</td>
							<td style="width:5%; border: 1px solid #7F9DB9;">
								<span id="qtySPAN">
									<select name="qty" id="qty" onchange="totalPrice(this.value, '${product.price}', 'total1')">
										<c:forEach var="i" begin="1" end="10" step="1">
										<option value="${i}">${i}</option>
										</c:forEach>	
									</select>
								</span>
							</td>
							<td style="width:15%; border: 1px solid #7F9DB9;">￥${qu:parsePrice(product.price)}(${product.unit})</td>
							<td style="width:15%; border: 1px solid #7F9DB9;">￥<span id="total1">${qu:parsePrice(product.price)}</span>(${product.unit})</td>
							<td style="width:8%; border: 1px solid #7F9DB9;">
								<c:choose>
									<c:when test="${product.if_able_discount == 0}">
										是
									</c:when>
									<c:otherwise>
										否
									</c:otherwise>
								</c:choose>
							</td>
							<td style="width:8%; border: 1px solid #7F9DB9;">
								<c:choose>
									<c:when test="${product.if_need_worker == 0}">
										是
									</c:when>
									<c:otherwise>
										否
									</c:otherwise>
								</c:choose>
								<input type="hidden" name="worker" id="worker1" value='${product.if_need_worker}' />
								<input type="hidden" name="chess" id="chess1"  value='${product.if_chess_room}' />
								<input type="hidden" name="productNo" id="productNo1"  value='${product.product_no}' />
								<input type="hidden" name="itemId1" id="itemId1" value="" />
							</td>							
						</tr>
						</c:when>
						<c:otherwise>
							<tr>
								<td colspan="7" style="width:20%; border: 1px solid #7F9DB9;">未绑定项目</td>
							</tr>
						</c:otherwise>
						</c:choose>
					</table>
				</div>
				
				<div style="margin-left: 200px; margin-top: 25px;">
					<span id="openSPAN">
						<input type="button" id="openRoomBtn" name="openRoomBtn" value="开房" onclick="$('#contactDiv').dialog('open')" />
						&nbsp;&nbsp;
						<input type="button" id="openRoomByTokenBtn" name="openRoomByTokenBtn" value="手牌开房" onclick="$('#tokenDiv').dialog('open')" />
						&nbsp;&nbsp;
					</span>
					<input type="button" name="returnBtn" value="返回 F5" onclick="onReturn()" />
					
				</div>
				
				<div id="tokenDiv" class="easyui-dialog" title="关联手牌" style="width:400px;height:150px;padding:10px;max-height: 10px;"
					data-options="
						iconCls: '手牌号',
						buttons: [{
							text:'确定',
							handler:function(){
								onOpenRoom();
							}
						},{
							text:'取消',
							handler:function(){
								$('#tokenDiv').dialog('close');
							}
						}]
				">
					开房手牌：<input type="text" name="token_no" id="token_no" />
				</div>
				
				<div id="contactDiv" class="easyui-dialog" title="推荐人" style="width:400px;height:150px;padding:10px;max-height: 10px;"
					data-options="
						iconCls: '推荐人',
						buttons: [{
							text:'确定',
							handler:function(){
								onOpenRoomNoToken();
							}
						},{
							text:'取消',
							handler:function(){
								$('#contactDiv').dialog('close');
							}
						}]
				">
					推荐人：<input type="text" name="contactStaffNo" id="contactStaffNo" />
				</div>
			</div>
		</div>
	</body>
</html>